<!DOCTYPE html>
<html>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
<link type="text/css" rel="stylesheet" th:href="@{/css/page.css}"/>
<script type="text/javascript" th:src="@{/js/jquery-1.11.3.min.js}" ></script>
<link rel="stylesheet" th:href="@{/js/layui-v2.5.4/layui/css/layui.css}" />
<script type="text/javascript" th:src="@{/js/layui-v2.5.4/layui/layui.js}" ></script>
<script type="text/javascript" th:src="@{/js/common.js}" ></script>


<title>桂林城市大脑门户</title>
<style type="text/css">
.flex_item{
	display: block;
    padding: 10px 20px;
    background-color: #1E9FFF;
    color: #fff;
    border-radius: 2px;
    transition: all .3s;
    -webkit-transition: all .3s;
    margin: 5px 10px;
    cursor: pointer;
    font-size: 16px;
}
.flex_item:hover {
	background-color: #FFB800;
	color: #fff;
}
</style>
</head>

<body >

<div id="app" style="padding:30px;"  >

	<div id="clientDiv" style="display:flex; flex-wrap: wrap; justify-content: flex-start;" >

	</div>

</div>

<script type="text/javascript">
var clientListArray = [];

layui.use(['layer', 'form'], function(){
	getMyClient();
});

function getMyClient(){
	//this.pageload(true, "加载中...");
	layer.msg('加载中...', {icon: 16, time: 0, shade: [0.3, '#393D49']});
	$.ajax({
		type: "POST",
		async: true,  //默认true,异步
		//data: paramString,
		//dataType: 'text',
		url: "[[@{/index/myClient}]]",
		success:function(data){
			if(data && data.code){
				if(data.code == "OK"){
					layer.closeAll();
					clientListArray = data.data;
			    	//<div v-for="(item, index) of clientList" :key="index" class="flex_item" @click="checkClient(item)" >{{item.clientName}}</div>
			    	for(var i=0; i<clientListArray.length; i++){
			    		var item = clientListArray[i];
			    		$("#clientDiv").append('<div class="flex_item" onclick="checkClient('+i+')" >'+item.clientName+'</div>');
			    	}
				}else if(data.code == "FAIL"){
					layer.alert(data.message, {icon: 2});
				}else{
					layer.alert('加载失败！', {icon: 2});
				}
			}else{
				layer.alert('加载失败！', {icon: 2});
			}
	    }
	});
};

function checkClient(i){
	//layer.msg('加载中...', {icon: 16, time: 0, shade: [0.3, '#393D49']});
	var item = clientListArray[i];
   /* window.open("[[@{/oauth/authorize}]]?selfFrom=server&response_type=code&client_id=" + item.clientId + "&redirect_uri=" + item.webServerRedirectUri + "&scope=" + item.scope, "_blank");*/
	top.location=item.webServerRedirectUri;
}
</script>
</body>

</html>
